<template>
  <div>
    <h1>辅助函数方式访问vuex</h1>
    <h2>{{ count }}</h2>
    <button @click="add">同步+3</button>
    <button @click="addAsync">异步+8</button>
  </div>
</template>

<script lang='ts'>
import {createNamespacedHelpers} from 'vuex'
import {defineComponent} from 'vue'
import { count } from 'console';
const {mapState:mapCounterState,mapMutations:mapCounterMutatations,mapActions:mapCounterActions}=createNamespacedHelpers('counter')
export default defineComponent({
    computed:{
        ...mapCounterState(['count'])
    },
    methods:{
        ...mapCounterMutatations({"incr":'INCREMENT'}),
        ...mapCounterActions(['incrementAsync']),
        add(){
            this.incr(3)
        },
        addAsync(){
            this.incrementAsync(8)
        }
    }
})
</script>

<style lang='scss' scoped>
</style>